﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>setup()函数</title>
</head>
<body>

    <div id="app">
        <post-item :post-content="content"></post-item>
    </div>

<!--引入vue文件-->
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<script>
    const vm = Vue.createApp({
        data() {
            return {
                content: '月浅等身去微软请问'
            }
        }
    });
    vm.component('PostItem', {
        // 声明props
        props: ['postContent'],
        setup(props) {
            Vue.watchEffect(() => {
                console.log(props.postContent);
            })
        },
        template: '<h3>{{ postContent }}</h3>'
    });
    vm.mount('#app');
</script>
</body>
</html>
